define([
  'text!' + ELMP.resource('components/selectRole/index.html','lib'),
  ELMP.resource('mixins/emitter.js', 'lib')
],
function (template,emitter) {
  return {
    template,
    name: 'SelectRole',
    model: {
      prop: 'value',
      event: 'input'
    },
    mixins: [emitter],
    props: {
      value: { type: [String,Array] },
      multiple: { type: Boolean, default: false},
      disabled: {
        type: Boolean,
        default: false
      },
      typeList: { type: Array, default: ()=> ['PROJECT'] }
    },
    watch: {
      value: {
        handler(){
          this.handleValue()
        },
        immediate: true
      },
      filterText(val) {
        this.$refs.tree.filter(val);
      }
    },
    data () {
      return {
        nodeKey: 'code',
        text: '',
        filterText: '',
        defaultProps: {
          children: 'children',
          label: 'displayCn'
        },
        data: [],
      }
    },
    created () {
      this.getTreedata()
    },
    mounted() {
      $.el.util.writeCss(ELMP.resource('components/selectRole/index.css', 'lib'), '.xDown')
    },
    computed: {
      elType(){
        if(this.multiple) return 'textarea'
        return 'text'
      }
    },
    methods: {
      handleValue(){
        if(!this.value){
          this.text = ''
          return
        }
        if(this.multiple){
          if(!Array.isArray(this.value)){
            this.value = []
          }
          this.text = this.value.map(item=> item.displayCn).join(',')
          return
        }
        this.text = this.value.displayCn
      },
      getTreedata(){
        Promise.all([$.elApi.role.type(),$.elApi.role.tree()]).then(([typeList,treeList])=>{
          const data = treeTool.fromList(treeList,{id: 'id',children: 'children',pid: 'parentId'})
          typeList = typeList.filter(type=> this.typeList.includes(type.value))
          typeList.forEach(element => {
            const children = data.filter(item=> item.type === element.value)
            element.children = children.map(item=>{
              item.parentId = element.id
              return item
            })
          });
          if(typeList.length===1){
            typeList = typeList[0].children
          }
          this.data = typeList
        })
      },
      filterNode(value, data) {
        if (!value) return true;
        return data.displayCn.indexOf(value) !== -1;
      },
      focusEvent () {
        if(this.disabled) return
        if(Array.isArray(this.value)){
          this.$refs.tree?.setCheckedKeys(this.value.map(item=> item.code))
        }
        this.$refs.xDown.showPanel()
      },
      save(){
        const data = this.$refs.tree.getCheckedNodes()
        this.text = data.map(item=> item.displayCn).join(',')
        this.$emit('input',data)
        this.$emit('change',data)
        this.dispatch('ElFormItem', 'el.form.change', [data])
        this.$refs.xDown.hidePanel()
      },
      clear(){
        this.$refs.tree.setCheckedNodes([])
      },
      nodeClick(data){
        this.text = data.displayCn
        this.$emit('input',data)
        this.$emit('change',data)
        this.dispatch('ElFormItem', 'el.form.change', [data])
        this.$refs.xDown.hidePanel()
      },
    }
  }
})
